<style lang="less">
@import '../assets/style/xs-list.less';
</style>

<template>
    <div class="xs_list">
    	<!--需要滑动删除时传deleteAble=true所需的模板-->
    	<van-cell-group v-if='deleteAble'>
    	 	<van-swipe-cell :right-width="65"  v-for="(item,index) in list" :key='index'>
		  	<van-cell-group>
		    	<van-cell  @click='listClick(item,0)'>
		    		<span 
	                	v-if="item"
	                    slot="icon">
	                    <img :src="item.status==0?listLeftImg[0]:item.status==1?listLeftImg[1]:item.status==2?listLeftImg[2]:listLeftImg[2]">
	                    <span v-if="item.alarm">
		                    <img 
		                    	src="@/assets/img/changguixunshi/icon_gaojing.png"
								class="icon_gj">
		                </span>
	                </span>
	                
	                <span class="date">{{item.date}}</span>
	                <template slot="title">
                    <div @click='listClick(item,1)'>
                        <div class="clearfix">
                            <span v-if="item.status == 0" class="van-cell-text" style="width: 80%;">{{item.line}}</span>
                            <span v-else-if="item.status == 1" class="van-cell-text" style="width: 80%;">{{item.line}}</span>
                            <span v-else class="van-cell-text">{{listTitle[0]}}{{item.line}}</span>
                            <van-tag plain :class="item.cname">{{item.statusName}}</van-tag>
                            <van-tag plain :class="item.cname1">{{item.statusName1}}</van-tag>
                        </div>
                        <div class="nums">
                            <span>{{listTitle[1]}}{{item.gtnum}}</span>
                            <span>{{listTitle[2]}}{{item.wxsnum}}</span>
                        </div>
                    </div>
                </template>
		   		</van-cell>
		  	</van-cell-group>
		  	<span slot="right" @click='onClose(item)'>删除</span>
		</van-swipe-cell>
    	</van-cell-group>
    	
    	<!--默认使用的模板-->
        <van-cell-group v-else>
            <van-cell
            class="van-ellipsis"
            v-for="(item,index) in list" :key="index">
                <span 
                	v-if="item"
                    slot="icon">
                    <span class="icon" @click='listClick(item,0)'>
                        <img :src="item.status==0?listLeftImg[0]:item.status==1?listLeftImg[1]:item.status==2?listLeftImg[2]:listLeftImg[2]">
                        <!-- <img :src="item.src" alt=""> -->
                        <span v-if="item.alarm">
                            <img 
                                src="@/assets/img/changguixunshi/icon_gaojing.png"
                                class="icon_gj">
                        </span>
                    </span>
                </span>
               
                <span class="date">{{item.date}}</span>
                <template slot="title">
                    <div @click='listClick(item,1)'>
                        <div class="clearfix">
                            <span v-if="item.status == 0" class="van-cell-text" style="width: 80%;">{{item.line}}</span>
                            <span v-else-if="item.status == 1" class="van-cell-text" style="width: 80%;">{{item.line}}</span>
                            <span v-else class="van-cell-text">{{listTitle[0]}}{{item.line}}</span>
                            <van-tag plain :class="item.cname">{{item.statusName}}</van-tag>
                            <van-tag plain :class="item.cname1">{{item.statusName1}}</van-tag>
                        </div>
                        <div class="nums">
                            <span>{{listTitle[1]}}{{item.gtnum}}</span>
                            <span>{{listTitle[2]}}{{item.wxsnum}}</span>
                        </div>
                    </div>
                </template>
                
            </van-cell>
		</van-cell-group>
	</div>
</template>

<script>
import {
    Cell,
    CellGroup,
    Tag,
    SwipeCell
} from 'vant';

export default {
    name: 'xs_list',
    components: {
        [Cell.name]: Cell,
        [CellGroup.name]: CellGroup,
        [Tag.name]: Tag,
        [SwipeCell.name]: SwipeCell
    },
    props: {
    		listLeftImg:{
            type: Array,
            default () {
                return []
            }
		},
    	listTitle:{
            type: Array,
            default () {
                return []
            }
		},
        list: Array,
        deleteAble:{
        	type: Boolean,
        	default() {
        		return false
        	}
        }
    },
    data() {
        return {
           cname: '',
           cname1: ''
        }
    },
    methods:{
        listClick(data,num){
            let param = {}
            param.todo = num
            param.data = data
            this.$emit('listClick',param)
        },
        
        /* iconClick(ev){
            this.$emit('iconClick',ev)
        }, */
        /* listClick(data){
            this.$emit('listClick',data)
        }, */
        onClose(item) {
        	this.$emit('onClose',item)
        }
    }
}
</script>
